<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html>
<!--<![endif]-->

<head>
<meta charset="utf-8">
<title>Boo Admin - Table</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="description" content="">
<meta name="author" content="">

<!-- Le styles -->
<link href="assets/css/lib/bootstrap.css" rel="stylesheet">
<link href="assets/css/lib/bootstrap-responsive.css" rel="stylesheet">
<link href="assets/css/extension.css" rel="stylesheet">
<link href="assets/css/boo.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/boo-coloring.css" rel="stylesheet">
<link href="assets/css/boo-utility.css" rel="stylesheet">

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
	<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <script src="assets/plugins/selectivizr/selectivizr-min.js"></script>
    <script src="assets/plugins/flot/excanvas.min.js"></script>
<![endif]-->

<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.html">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.html">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.html">
<link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.html">
</head>

<body id="tableBase" class="sidebar-left sidebar-display panel-side">
<div class="page-container">
    <div id="header-container">
        <div id="header">
            <div class="navbar navbar-inverse navbar-fixed-top">
                <div class="navbar-inner">
                    <div class="container-fluid">
                        <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
                        <a class="brand" href="javascript:void(0);"><img src="assets/img/demo/logo-brand.png"></a>
                        <div class="search-global">
                            <input id="globalSearch" class="search search-query input-medium" type="search">
                            <a class="search-button" href="javascript:void(0);"><i class="fontello-icon-search-5"></i></a> </div>
                        <div class="nav-collapse collapse">
                            <ul class="nav user-menu visible-desktop">
                                <li><a class="btn-glyph fontello-icon-edit tip-bc" href="javascript:void(0);" title="Messages"><span class="badge badge-important">8</span></a></li>
                                <li><a class="btn-glyph fontello-icon-mail-1 tip-bc" href="javascript:void(0);" title="Emails"></a></li>
                                <li><a class="btn-glyph fontello-icon-lifebuoy tip-bc" href="javascript:void(0);" title="Support"><span class="badge badge-important">4</span></a></li>
                            </ul>
                            <ul class="nav">
                                <li> <a href="dashboard-one.html">Dashboard</a> </li>
                                <li class="active"> <a href="javascript:void(0);">Components</a> </li>
                                <li> <a href="component-fullcalendar-demo.html"><span class="fontello-icon-calendar"></span>Calendar</a> </li>
                                <li> <a href="javascript:void(0);"><span class="fontello-icon-users"></span>Contacts</a> </li>
                                <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown"><span class="fontello-icon-list-1"></span>Customize <b class="caret"></b></a>
                                    <ul class="dropdown-menu">
                                        <li><a href="component-form-demo.html">Demo Form</a></li>
                                        <li><a href="component-widgets-remember.html">Remember</a></li>
                                        <li><a href="component-widgets-users.html">User List</a></li>
                                        <li class="divider"></li>
                                        <li class="nav-header">Next Update</li>
                                        <li><a href="javascript:void(0);">Contacts</a></li>
                                        <li><a href="javascript:void(0);">Email</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <!-- // navbar -->
            
            <div class="header-drawer">
                <div class="mobile-nav text-center visible-phone"> <a href="javascript:void(0);" class="mobile-btn" data-toggle="collapse" data-target=".sidebar"><i class="aweso-icon-chevron-down"></i> Components</a> </div>
                <!-- // Resposive navigation -->
                <div class="breadcrumbs-nav hidden-phone">
                    <ul id="breadcrumbs" class="breadcrumb">
                        <li><a href="javascript:void(0);"><i class="fontello-icon-home f12"></i> Dashboard</a> <span class="divider">/</span></li>
                        <li class="dropdown"><a href="javascript:void(0);">Table </a> <span class="divider">/</span>
                            <ul class="dropdown-menu">
                                <li><a href="javascript:void(0);">Table</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                                <li><a href="javascript:void(0);">Elements</a></li>
                            </ul>
                        </li>
                        <li class="active">Boo Admin </li>
                    </ul>
                </div>
                <!-- // breadcrumbs --> 
            </div>
            <!-- // drawer --> 
        </div>
    </div>
    <!-- // header-container -->
    
    <div id="main-container">
        <div id="main-sidebar" class="sidebar sidebar-inverse">
            <div class="sidebar-item">
                <div class="media profile">
                    <div class="media-thumb media-left thumb-bordereb"> <a class="img-shadow" href="javascript:void(0);"><img class="thumb" src="assets/img/demo/demo-avatar9604.jpg"></a> </div>
                    <div class="media-body">
                        <h5 class="media-heading">Twitter Bootstrap <small>as Administrator</small></h5>
                        <p class="data">Last Access: 16 May 15:30</p>
                    </div>
                </div>
            </div>
            <!-- // sidebar item - profile -->
            
            <ul id="mainSideMenu" class="nav nav-list nav-side">
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accDash" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-monitor"></span> <i class="chevron fontello-icon-right-open-3"></i> Dashboards </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accDash">
                        <li> <a href="dashboard-one.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Dashboard</span> Demo 1 </a> </li>
                        <li> <a href="dashboard-two.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Dashboard</span> Demo 2 </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Dashboard -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accForms" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon aweso-icon-list-alt"></span><i class="chevron fontello-icon-right-open-3"></i> Form </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accForms">
                        <li> <a href="component-form-demo.html"> <i class="fontello-icon-right-dir"></i> Demo Form </a> </li>
                        <li> <a href="component-form-element.html"> <i class="fontello-icon-right-dir"></i> Form Element </a> </li>
                        <li> <a href="component-form-extension.html"> <i class="fontello-icon-right-dir"></i> Form Extension</a> </li>
                        <li> <a href="component-form-wizard.html"> <i class="fontello-icon-right-dir"></i> Form Wizard</a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Forms -->
                <li class="accordion-group">
                    <div class="accordion-heading active"> <a href="#accTables" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-align-justify"></span> <i class="chevron fontello-icon-right-open-3"></i> Tables </a> </div>
                    <ul class="accordion-content nav nav-list collapse in" id="accTables">
                        <li class="active"> <a href="component-table.html"> <i class="fontello-icon-right-dir"></i> Base Table </a> </li>
                        <li> <a href="component-table-boo.html"> <i class="fontello-icon-right-dir"></i> Boo Table </a> </li>
                        <li> <a href="component-table-datatable.html"> <i class="fontello-icon-right-dir"></i> DataTable </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Tables -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accStatistics" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-chart"></span> <i class="chevron fontello-icon-right-open-3"></i> Statistics </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accStatistics">
                        <li> <a href="statistic-flot.html"> <i class="fontello-icon-right-dir"></i> Charts </a> </li>
                        <li> <a href="statistic-sparkline.html"> <i class="fontello-icon-right-dir"></i> Sparklines </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Statistics -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accWidgets" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon  fontello-icon-window"></span> <i class="chevron fontello-icon-right-open-3"></i> Widgets </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accWidgets">
                        <li> <a href="component-widget-style.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Widgets </span> Style </a> </li>
                        <li> <a href="component-widget-custom.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Widgets </span> Custom </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Widgets -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accButtons" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-puzzle"></span> <i class="chevron fontello-icon-right-open-3"></i> UI Elements </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accButtons">
                        <li> <a href="elements-button.html"> <i class="fontello-icon-right-dir"></i> Button </a> </li>
                        <li> <a href="elements-icon-font.html"> <i class="fontello-icon-right-dir"></i> Iconic fonts </a> </li>
                        <li> <a href="elements-icon-fugue-demo.html"> <i class="fontello-icon-right-dir"></i> Icon </a> </li>
                        <li> <a href="elements-wells.html"> <i class="fontello-icon-right-dir"></i> Wells </a> </li>
                        <li> <a href="elements-tabs.html"> <i class="fontello-icon-right-dir"></i> Tabs </a> </li>
                        <li> <a href="elements-modals.html"> <i class="fontello-icon-right-dir"></i> Modal </a> </li>
                        <li> <a href="elements-progressbar.html"> <i class="fontello-icon-right-dir"></i> Progressbar </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu UI Elements -->
                <li class="accordion-group">
                    <div class="accordion-heading"> <a href="#accCalendar" data-parent="#mainSideMenu" data-toggle="collapse" class="accordion-toggle"> <span class="item-icon fontello-icon-calendar"></span> <i class="chevron fontello-icon-right-open-3"></i> Calendar </a> </div>
                    <ul class="accordion-content nav nav-list collapse" id="accCalendar">
                        <li> <a href="component-fullcalendar-demo.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Calendar </span> Demo </a> </li>
                        <li> <a href="component-fullcalendar.html"> <i class="fontello-icon-right-dir"></i> <span class="hidden-tablet">Calendar </span> Style </a> </li>
                    </ul>
                </li>
                <!-- // item accordionMenu Calendar -->
            </ul>
            <!-- // sidebar menu -->
            
            <div class="sidebar-item"></div>
            <!-- // sidebar item --> 
            
        </div>
        <!-- // sidebar -->
        
        <div id="main-content" class="main-content container-fluid">
            <div class="row-fluid page-head">
                <h2><i class="aweso-icon-table"></i> Tables <small>simple data dump</small></h2>
            </div>
            <!-- // page head -->
            
            <div id="page-content" class="page-content tab-content">
                <section>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="well well-box well-nice">
                                <div class="navbar">
                                    <div class="navbar-inner no-bg">
                                        <h4 class="title"><i class="fontello-icon-window"></i> Classes for tables <small>default</small></h4>
                                    </div>
                                </div>
                                <!-- // navbar -->
                                <div class="section-content item">
                                    <p>Default Bootstrap classes for table</p>
                                </div>
                                <!-- // content item -->
                                <table class="table table-striped table-content">
                                    <thead>
                                        <tr>
                                            <th>class</th>
                                            <th>description</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><code>.table</code></td>
                                            <td>default table style</td>
                                        </tr>
                                        <tr>
                                            <td><code>.table-striped</code></td>
                                            <td>Adds zebra-striping to any table row within the <code>tbody</code></td>
                                        </tr>
                                        <tr>
                                            <td><code>.table-bordered</code></td>
                                            <td>Add borders and rounded corners to the table.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.table-hover</code></td>
                                            <td>Enable a hover state on table rows within a <code>tbody</code></td>
                                        </tr>
                                        <tr>
                                            <td><code>.table-condensed</code></td>
                                            <td>Makes tables more compact by cutting cell padding in half.</td>
                                        </tr>
                                    </tbody>
                                </table>
                                <!-- // table-content --> 
                            </div>
                            <pre class="prettyprint linenums">
&lt;!-- Table base --&gt;
&lt;table class="table"&gt;
    ...
&lt;/table&gt;

&lt;!-- Table combine class --&gt;
&lt;table class="table table-striped table-bordered  table-hover table-condensed"&gt;
    ...
&lt;/table&gt;
</pre>
                        </div>
                        <!-- // Column -->
                        
                        <div class="span8">
                            <h3><i class="aweso-icon-table"></i> table <small>.table</small></h3>
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col" class="hidden-phone">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col">Date of birth</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td class="hidden-phone">Long Beach</td>
                                        <td class="hidden-tablet hidden-phone">semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td class="hidden-phone">Lockport</td>
                                        <td class="hidden-tablet hidden-phone">commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td class="hidden-phone">Cody</td>
                                        <td class="hidden-tablet hidden-phone">aliquet@Craspellentesque.com</td>
                                        <td>10/17/1979</td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Default -->
                            
                            <hr>
                            <h3><i class="aweso-icon-table"></i> table <small>.table-striped</small></h3>
                            <table class="table table-striped">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col" class="hidden-phone">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col">Date of birth</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td class="hidden-phone">Long Beach</td>
                                        <td class="hidden-tablet hidden-phone">semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td class="hidden-phone">Lockport</td>
                                        <td class="hidden-tablet hidden-phone">commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td class="hidden-phone">Cody</td>
                                        <td class="hidden-tablet hidden-phone">aliquet@Craspellentesque.com</td>
                                        <td>10/17/1979</td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Striped -->
                            
                            <hr>
                            <h3><i class="aweso-icon-table"></i> table <small>.table-bordered</small></h3>
                            <p>Clik email to open model</p>
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col" class="hidden-phone">Date of birth</th>
                                        <th scope="col" class="action">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td>Long Beach</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">semper@diamSeddiam.edu</a></td>
                                        <td class="hidden-phone">02/10/1986</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td>Lockport</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">commodo@conseque.ca </a></td>
                                        <td class="hidden-phone">04/21/1959</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td>Bentonville</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">nunc.sed@liberoInteger.ca </a></td>
                                        <td class="hidden-phone">12/11/1971</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td>Troy</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">Nunc@sedliberoProin.edu </a></td>
                                        <td class="hidden-phone">08/09/1976</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td>Cody</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">aliquet@Craspellentesque.com </a></td>
                                        <td class="hidden-phone">10/17/1979</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Bordered -->
                            
                            <hr>
                            <h3><i class="aweso-icon-table"></i> table <small>rowspan colspan</small></h3>
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col" class="hidden-phone">Date of birth</th>
                                        <th scope="col" class="action">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td>Long Beach</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">semper@diamSeddiam.edu</a></td>
                                        <td class="hidden-phone">02/10/1986</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td rowspan="2">2</td>
                                        <td rowspan="2">Naida Bennett</td>
                                        <td rowspan="2">Lockport</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">commodo@conseque.ca </a></td>
                                        <td rowspan="2" class="hidden-phone">04/21/1959</td>
                                        <td rowspan="2" class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">nunc.sed@liberoInteger.ca </a></td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td>Troy</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">Nunc@sedliberoProin.edu </a></td>
                                        <td class="hidden-phone">08/09/1976</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td colspan="2">Marvin Bell - Cody</td>
                                        <td class="hidden-tablet hidden-phone"><i class="fontello-icon-edit-2"></i> <a href="#modalEmail" data-toggle="modal">aliquet@Craspellentesque.com </a></td>
                                        <td class="hidden-phone">10/17/1979</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a></td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Bordered -->
                            
                            <hr>
                            <h3><i class="aweso-icon-table"></i> table <small>.table-condensed .table-hover</small></h3>
                            <table class="table table-condensed table-hover">
                                <caption>
                                Default Table Caption - Title fot table
                                </caption>
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">Adresse</th>
                                        <th scope="col" class="action">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td>6890 East Spring Street, Unit 2L Long Beach, California 90815, USA</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td>597 Washburn St, Lockport, NY 14094, USA</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td>2679 Magellan Blvd 72712 Bentonville, USA</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td>4058 Livernois Rd 48098 Troy United States</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td>456 Yellowstone Avenue, Cody Wy Us 82414, Cody, WY, 82414 USA</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Condensed -->
                            
                            <hr>
                            <h3><i class="aweso-icon-table"></i> table <small>combine all class</small></h3>
                            <table class="table table-bordered table-striped table-condensed table-hover">
                                <caption>
                                Default Table Caption - <span>Title fot table</span>
                                </caption>
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">City</th>
                                        <th scope="col">Email</th>
                                        <th scope="col">Date of birth</th>
                                        <th scope="col" class="action">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td>Long Beach</td>
                                        <td>semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a> <a class="icon" href="#"><i class="fugue-cross-circle" title="delete"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td>Lockport</td>
                                        <td>commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a> <a class="icon" href="#"><i class="fugue-cross-circle" title="delete"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td>Bentonville</td>
                                        <td>nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a> <a class="icon" href="#"><i class="fugue-cross-circle" title="delete"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td>Troy</td>
                                        <td>Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a> <a class="icon" href="#"><i class="fugue-cross-circle" title="delete"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td>Cody</td>
                                        <td>aliquet@Craspellentesque.com</td>
                                        <td>10/17/1979</td>
                                        <td class="action"><a class="icon" href="#"><i class="fugue-magnifier" title="detail"></i></a> <a class="icon" href="#"><i class="fugue-pencil" title="edit"></i></a> <a class="icon" href="#"><i class="fugue-cross-circle" title="delete"></i></a></td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table All Combined -->
                            
                        </div>
                        <!-- // Column --> 
                    </div>
                </section>
                <section>
                    <div class="page-header">
                        <h3><i class="fontello-icon-palette opaci35"></i> Table color option <small>coloring table</small></h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="well well-box well-nice">
                                <div class="navbar">
                                    <div class="navbar-inner no-bg">
                                        <h4 class="title"><i class="fontello-icon-window"></i> Optional row classes <small>color table rows</small></h4>
                                    </div>
                                </div>
                                <!-- // navbar -->
                                <table class="table table-striped table-content">
                                    <thead>
                                        <tr>
                                            <th>class</th>
                                            <th>description</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><code>.success</code></td>
                                            <td>Indicates a successful or positive action.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.error</code></td>
                                            <td>Indicates a dangerous or potentially negative action.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.warning</code></td>
                                            <td>Indicates a warning that might need attention.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.info</code></td>
                                            <td>Used as an alternative to the default styles.</td>
                                        </tr>
                                    </tbody>
                                </table>
                                <!-- // table-content --> 
                            </div>
                            <pre class="prettyprint linenums">
&lt;!-- Table base --&gt;
&lt;table class="table"&gt;
    &lt;tr class="success"&gt; ... &lt;/tr&gt;
&lt;/table&gt;
</pre>
                        </div>
                        <!-- // Column -->
                        
                        <div class="span8">
                            <h3><i class="aweso-icon-table"></i> table <small>color row</small></h3>
                            <table class="table table-bordered table-striped">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col" class="hidden-phone">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col">Date of birth</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr class="success">
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td class="hidden-phone">Long Beach</td>
                                        <td class="hidden-tablet hidden-phone">semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                    </tr>
                                    <tr class="error">
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td class="hidden-phone">Lockport</td>
                                        <td class="hidden-tablet hidden-phone">commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                    </tr>
                                    <tr class="warning">
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr class="info">
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td class="hidden-phone">Cody</td>
                                        <td class="hidden-tablet hidden-phone">aliquet@Craspellentesque.com</td>
                                        <td>10/17/1979</td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Default --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row -->
                    <hr>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="well well-box well-nice">
                                <div class="navbar">
                                    <div class="navbar-inner no-bg">
                                        <h4 class="title"><i class="fontello-icon-window"></i> Optional background <small>color table</small></h4>
                                    </div>
                                </div>
                                <!-- // navbar -->
                                <table class="table table-striped table-content">
                                    <thead>
                                        <tr>
                                            <th>class</th>
                                            <th>description</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><code>.bg-blue-light</code></td>
                                            <td>Sets the background color.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.bg-green-light</code></td>
                                            <td>Sets the background color.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.bg-yellow-light</code></td>
                                            <td>Sets the background color.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.bg-...</code></td>
                                            <td>Variants <code>-light -medium -strong</code></td>
                                        </tr>
                                        <tr>
                                            <td><code>.bg-white</code></td>
                                            <td>Sets the background color to white.</td>
                                        </tr>
                                        <tr>
                                            <td><code>.bg-...</code></td>
                                            <td>Variants for white <code> -white25 -white50 -white75 -white</code></td>
                                        </tr>
                                    </tbody>
                                </table>
                                <!-- // table-content --> 
                            </div>
                            <pre class="prettyprint linenums">
&lt;!-- Table base --&gt;
&lt;table class="table bg-green-light"&gt;
    ...
&lt;/table&gt;

&lt;table class="table"&gt;
    &lt;tbody class="bg-blue-medium"&gt; ... &lt;/tbody&gt;
&lt;/table&gt;
</pre>
                        </div>
                        <!-- // Column -->
                        
                        <div class="span8">
                            <h3><i class="aweso-icon-table"></i> table <small>color background</small></h3>
                            <table class="table table-bordered table-condensed  bg-green-light">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col" class="hidden-phone">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col">Date of birth</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td class="hidden-phone">Long Beach</td>
                                        <td class="hidden-tablet hidden-phone">semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                    </tr>
                                    <tr class="error">
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td class="hidden-phone">Lockport</td>
                                        <td class="hidden-tablet hidden-phone">commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Default -->
                            <hr>
                            <h3><i class="aweso-icon-table"></i> Table <small>.table</small></h3>
                            <table class="table table-bordered table-striped table-condensed">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col" class="hidden-phone">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col">Date of birth</th>
                                    </tr>
                                </thead>
                                <tbody class="bg-blue-medium">
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td class="hidden-phone">Long Beach</td>
                                        <td class="hidden-tablet hidden-phone">semper@diamSeddiam.edu</td>
                                        <td>02/10/1986</td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td class="hidden-phone">Lockport</td>
                                        <td class="hidden-tablet hidden-phone">commodo@conseque.ca</td>
                                        <td>04/21/1959</td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td class="hidden-phone">Bentonville</td>
                                        <td class="hidden-tablet hidden-phone">nunc.sed@liberoInteger.ca</td>
                                        <td>12/11/1971</td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td class="hidden-phone">Troy</td>
                                        <td class="hidden-tablet hidden-phone">Nunc@sedliberoProin.edu</td>
                                        <td>08/09/1976</td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Default -->
                            <hr>
                        </div>
                        <!-- // Column --> 
                    </div>
                    <!-- // Example row --> 
                    
                </section>
                <section>
                    <div class="page-header">
                        <h3><i class="fontello-icon-link-1 opaci35"></i> Row link <small>plugin for bootstrap table</small></h3>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <p>This plugin turns a table row into a clickable link.</p>
                            <pre class="prettyprint linenums">
&lt;!-- Row Link --&gt;
&lt;table data-provides="rowlink"&gt;
...
&lt;/table&gt;
</pre>
                            <p>Add <code>data-provides="rowlink"</code> to a <code>&lt;table&gt;</code>, <code>&lt;tbody&gt;</code> or <code>&lt;tr&gt;</code> element. The value should be selector to the link, which is a child of the row. A cell can be excluded by adding the <code>.nolink</code> class to the <code>&lt;td&gt;</code>.</p>
                        </div>
                        <!-- // Column -->
                        
                        <div class="span8">
                            <p>Click <span class="label label-info">icon detail</span> or <span class="label label-info">table row</span>.</p>
                            <table class="table table-bordered table-condensed table-hover bg-white75" data-provides="rowlink">
                                <thead>
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">City</th>
                                        <th scope="col" class="hidden-tablet hidden-phone">Email</th>
                                        <th scope="col" class="hidden-phone">Date of birth</th>
                                        <th scope="col" class="action">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>1</td>
                                        <td>Colin Nixon</td>
                                        <td>Long Beach</td>
                                        <td class="hidden-tablet hidden-phone"><a href="mailto:boo@boo">semper@diamSeddiam.edu</a></td>
                                        <td class="hidden-phone">02/10/1986</td>
                                        <td class="action nolink"><a class="icon" href="#modalRowLink" data-toggle="modal"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>2</td>
                                        <td>Naida Bennett</td>
                                        <td>Lockport</td>
                                        <td class="hidden-tablet hidden-phone"><a href="mailto:boo@boo">commodo@conseque.ca </a></td>
                                        <td class="hidden-phone">04/21/1959</td>
                                        <td class="action nolink"><a class="icon" href="#modalRowLink" data-toggle="modal"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>3</td>
                                        <td>Danielle Myers</td>
                                        <td>Bentonville</td>
                                        <td class="hidden-tablet hidden-phone"><a href="mailto:boo@boo">nunc.sed@liberoInteger.ca </a></td>
                                        <td class="hidden-phone">12/11/1971</td>
                                        <td class="action nolink"><a class="icon" href="#modalRowLink" data-toggle="modal"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>4</td>
                                        <td>Whitney Jones</td>
                                        <td>Troy</td>
                                        <td class="hidden-tablet hidden-phone"><a href="mailto:boo@boo">Nunc@sedliberoProin.edu </a></td>
                                        <td class="hidden-phone">08/09/1976</td>
                                        <td class="action nolink"><a class="icon" href="#modalRowLink" data-toggle="modal"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                    <tr>
                                        <td>5</td>
                                        <td>Marvin Bell</td>
                                        <td>Cody</td>
                                        <td class="hidden-tablet hidden-phone"><a href="mailto:boo@boo">aliquet@Craspellentesque.com </a></td>
                                        <td class="hidden-phone">10/17/1979</td>
                                        <td class="action nolink"><a class="icon" href="#modalRowLink" data-toggle="modal"><i class="fugue-magnifier" title="detail"></i></a></td>
                                    </tr>
                                </tbody>
                            </table>
                            <!-- // Table Row link --> 
                            
                        </div>
                        <!-- // Column --> 
                        
                    </div>
                    <!-- // Example row --> 
                    
                </section>
            </div>
            <!-- // page content --> 
            
        </div>
        <!-- // main-content --> 
        
    </div>
    <!-- // main-container  -->
    
    <footer id="footer-fix">
        <div id="footer-sidebar" class="footer-sidebar">
            <div class="navbar">
                <div class="btn-toolbar"> <a class="btn btn-glyph btn-link" href="javascript:void(0);"><i class="fontello-icon-up-open-1"></i></a> </div>
            </div>
        </div>
        <!-- // footer sidebar -->
        
        <div id="footer-content" class="footer-content">
            <div class="navbar navbar-inverse">
                <div class="navbar-inner">
                    <ul class="nav pull-left">
                        <li class="divider-vertical hidden-phone"></li>
                        <li><a id="btnToggleSidebar" class="btn-glyph fontello-icon-resize-full-2 tip hidden-phone" href="javascript:void(0);" title="show hide sidebar"></a></li>
                        <li class="divider-vertical hidden-phone"></li>
                        <li><a id="btnChangeSidebar" class="btn-glyph fontello-icon-login tip hidden-phone" href="javascript:void(0);" title="change sidebar position"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnChangeSidebarColor" class="btn-glyph fontello-icon-palette tip" href="javascript:void(0);" title="change sidebar color"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-cw" href="javascript:void(0);"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="fontello-icon-home-3" href="dashboard-one.html"></a></li>
                        <li class="divider-vertical"></li>
                    </ul>
                    <ul class="nav pull-right">
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-help-2 tip" href="javascript:void(0);" title="help to page"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a class="btn-glyph fontello-icon-cog-4 tip" href="javascript:void(0);" title="settings app"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnLogout" class="btn-glyph fontello-icon-logout-1 tip" href="javascript:void(0);" title="logout"></a></li>
                        <li class="divider-vertical"></li>
                        <li><a id="btnScrollup" class="scrollup btn-glyph fontello-icon-up-open-1" href="javascript:void(0);"><span class="hidden-phone">Scroll</span></a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- // footer content --> 
        
    </footer>
    <!-- // footer-fix  --> 
    
</div>
<!-- // page-container  --> 

<!-- You can put your modal definitions here but it is not required -->
<div class="modal-container">
    <div id="modalRowLink" class="modal hide fade" tabindex="-1">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4>Modal header</h4>
        </div>
        <div class="modal-body">
            <p><span class="label label-info">Tip!</span> Add <code>.rowlink</code> to your <code>&lt;a&gt;</code>. This prevents the link styling during page load.</p>
        </div>
        <div class="modal-footer">
            <button type="button" data-dismiss="modal" class="btn btn-boo">Close</button>
            <button type="button" class="btn btn-green">Ok</button>
        </div>
    </div>
    <!-- // sample modal - custom manager  --> 
    
</div>
<div id="modalEmail" class="modal hide fade" tabindex="-1">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4><i class="fontello-icon-mail-4"></i>New Message</h4>
    </div>
    <div class="modal-body">
        <div class="row-fluid">
            <form id="formNotes" class="span12 form-dark">
                <fieldset>
                    <label for="mailTo" class="control-label"> To</label>
                    <input id="mailTo" class="input-block-level" type="text" value="Colin Nixon - semper@diamSeddiam.edu">
                    <label for="mailSubject" class="control-label"> Subjest</label>
                    <input id="mailSubject" class="input-block-level" type="text">
                    <label for="mailMessage">Note Text:</label>
                    <textarea id="mailMessage" class="input-block-level auto" rows="5" style="min-height:130px"></textarea>
                </fieldset>
                <!-- // fieldset Input -->
            </form>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-boo">Cancel</button>
        <button type="button" class="btn btn-green">Send message</button>
    </div>
</div>
<!-- // sample modal - custom manager  --> 

<!-- Le javascript --> 
<!-- Placed at the end of the document so the pages load faster --> 
<script src="assets/plugins/bootstrap-wysihtml5/lib/js/wysihtml5-0.3.0.min.js"></script> 
<script src="assets/js/lib/jquery.js"></script> 
<script src="assets/js/lib/jquery-ui.js"></script> 
<script src="assets/js/lib/bootstrap.js"></script> 
<script src="assets/js/lib/jquery.cookie.js"></script> 

<!-- Plugins Bootstrap --> 
<script src="assets/plugins/bootstrap-datepicker/js/bootstrap-datepicker.js"></script> 
<script src="assets/plugins/bootstrap-timepicker/js/bootstrap-timepicker.js"></script> 
<script src="assets/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script> 
<script src="assets/plugins/bootstrap-daterangepicker/js/date.js"></script> 
<script src="assets/plugins/bootstrap-daterangepicker/js/bootstrap-daterangepicker.js"></script> 
<script src="assets/plugins/bootstrap-fileupload/js/bootstrap-fileupload.js"></script> 
<script src="assets/plugins/bootstrap-rowlink/js/bootstrap-rowlink.js"></script> 
<script src="assets/plugins/bootstrap-progressbar/js/bootstrap-progressbar.js"></script> 
<script src="assets/plugins/bootstrap-wysihtml5/src/bootstrap-wysihtml5.js"></script> 
<script src="assets/plugins/bootstrap-select/bootstrap-select.js"></script> 
<script src="assets/plugins/bootstrap-bootbox/bootbox.min.js"></script> 
<script src="assets/plugins/bootstrap-modal/js/bootstrap-modalmanager.js"></script> 
<script src="assets/plugins/bootstrap-modal/js/bootstrap-modal.js"></script> 
<script src="assets/plugins/bootstrap-wizard/js/bootstrap-wizard.js"></script> 
<script src="assets/plugins/bootstrap-toggle-buttons/js/bootstrap-toggle-buttons.js"></script> 

<!-- Plugins Custom --> 
<script src="assets/plugins/google-code-prettify/prettify.js"></script> 
<script src="assets/plugins/nicescroll/jquery.nicescroll.min.js"></script> 
<script src="assets/plugins/qtip2/dist/jquery.qtip.min.js"></script> 
<script src="assets/plugins/list/js/list.min.js"></script> 
<script src="assets/plugins/list/plugins/list.paging.min.js"></script> 
<script src="assets/plugins/fullcalendar/fullcalendar.js"></script> 

<!-- Plugins Forms --> 
<script src="assets/plugins/uniform/jquery.uniform.js"></script> 
<script src="assets/plugins/select2/select2.min.js"></script> 
<script src="assets/plugins/counter/jquery.counter.js"></script> 
<script src="assets/plugins/elastic/jquery.elastic.js"></script> 
<script src="assets/plugins/inputmask/jquery.inputmask.js"></script> 
<script src="assets/plugins/inputmask/jquery.inputmask.extensions.js"></script> 
<script src="assets/plugins/validate/js/jquery.validate.min.js"></script> 
<script src="assets/plugins/xbreadcrumbs/xbreadcrumbs.js"></script> 

<!-- Charts --> 
<script src="assets/plugins/sparkline/jquery.sparkline.js"></script> 
<script src="assets/plugins/flot/jquery.flot.js"></script> 
<script src="assets/plugins/flot/jquery.flot.categories.js"></script> 
<script src="assets/plugins/flot/jquery.flot.grow.js"></script> 
<script src="assets/plugins/flot/jquery.flot.orderBars.js"></script> 
<script src="assets/plugins/flot/jquery.flot.pie.js"></script> 
<script src="assets/plugins/flot/jquery.flot.resize.js"></script> 
<script src="assets/plugins/flot/jquery.flot.selection.js"></script> 
<script src="assets/plugins/flot/jquery.flot.stack.js"></script> 
<script src="assets/plugins/flot/jquery.flot.stackpercent.js"></script> 
<script src="assets/plugins/flot/jquery.flot.time.js"></script> 

<!-- Plugins Tables --> 
<script src="assets/plugins/datatables/media/js/jquery.dataTables.js"></script> 
<script src="assets/plugins/datatables/plugin/jquery.dataTables.plugins.js"></script> 
<script src="assets/plugins/datatables/plugin/jquery.dataTables.columnFilter.js"></script> 

<!-- main js --> 
<script src="assets/js/application.js"></script> 

<!-- Only This Demo Page -->
</body>
</html>
